<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>layui</title>
  <link rel="stylesheet" href="./layui/css/layui.css"  media="all">
  <!-- 注意：如果你直接复制所有代码到本地，上述css路径需要改成你本地的 -->
</head>
<body>

<div class="demoTable">
  商品名称:
  <div class="layui-inline">
    <input class="layui-input" name="id" id="demoReload" autocomplete="off">
  </div>
        分类名称：
        <div class="layui-inline">
            <select name="type_id" class="layui-input" lay-filter="" id="search_type_id">
            </select>
        </div>
        是否显示：
        <div class="layui-inline">
            <select name="goods_show" class="layui-input" lay-filter="" id="search_goods_show">
                <option value="">--请选择--</option>
                <option value="1">显示</option>
                <option value="2">不显示</option>
            </select>
        </div>
  <button class="layui-btn" data-type="reload">搜索</button>
</div>

 <fieldset class="layui-elem-field" style="margin-top: 10px;">
        <div style="margin: 10px;">
            <a href="javascript:void(0)" style="height: 38px; line-height: 38px;"><strong>商品列表</strong></a>
            <a class="layui-btn" style="float: right;" href="./goods_add.html">添加商品</a>
        </div>
    </fieldset>

           
<table class="layui-hide" id="test" lay-filter="demo"></table>

 <script type="text/html" id="barDemo">
  <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="detail" href="./goods_order.html?goods_id={{d.goods_id}}&type_id={{d.type_id}}">查看</a>
  <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
  <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
</script>   


 <script type="text/html" id="img_one">
       {{#  layui.each(d.img_one.split(','),function(index, item){ }}
               <img src="http://127.0.0.1/localhost/linaxi/php/public/uploads/{{ item }}">
      {{#  }); }}

 </script>  

  <script type="text/html" id="img_more">
       {{#  layui.each(d.img_more.split(','),function(index, item){ }}
               <img src="http://127.0.0.1/localhost/linaxi/php/public/uploads/{{ item }}">
      {{#  }); }}

 </script>  

 
<script src="./layui/layui.js" charset="utf-8"></script>
<!-- 注意：如果你直接复制所有代码到本地，上述js路径需要改成你本地的 -->
 
<script>
layui.use(['table','upload'],function(){
  var table = layui.table;
  var upload = layui.upload;
  

  // var typeId=getUrlParam('typeId');
  // var goodsId=getUrlParam('goodsId');
  // var url=location.href
  // var url_arr=url.split('?')
  // var param_arr=url_arr[1].split('=')
  // if(param==p[0])
  // {
  //     return p[1];
  // }

  // function getUrlParam()
  // {

  // }
   //多条件搜索 
 var $ = layui.$, active = {
    reload: function(){
      var demoReload = $('#demoReload');
      
      //执行重载
      table.reload('testReload', {
        page: {
          curr: 1 //重新从第 1 页开始
        }
        ,where: {
          key: {
            id: demoReload.val()
               // goods_name:$('#search_goods_name').val();
               // type_id:$('#serach_type_id').val();
               // goods_show:$('#search_goods_show').val();
          }
        }
      }, 'data');
    }
  };
  
  $('.demoTable .layui-btn').on('click', function(){
    var type = $(this).data('type');
    active[type] ? active[type].call(this) : '';
  });

    //搜索
  var $ = layui.$, 
    active = {
    reload: function(){
      var demoReload = $('#demoReload');
      
      //执行重载
      table.reload('testReload', {
        method:'GET',
        url:'http://127.0.0.1/localhost/linaxi/php/public/index.php/index/admin/search',
        page: {
          curr: 1 //重新从第 1 页开始
        }
        ,where: {
          key: {
            name: demoReload.val()
          }
        }
      }, 'data');
    }
  };

  $('.demoTable .layui-btn').on('click', function(){
    var type = $(this).data('type');
    active[type] ? active[type].call(this) : '';
  });  
   var $=layui.$
   //监听工具条
  table.on('tool(demo)', function(obj){
    var data = obj.data;
     if(obj.event === 'del'){
       // location.href="order.html?id="+data.id
      layer.confirm('真的删除行么', function(index){
        // obj.del();
            $.ajax({
                  method:'delete',
                  url:'http://127.0.0.1/localhost/linaxi/php/public/index.php/index/admin/dels',
                  data:{id:data.goods_id},
                  dataType:'JSON',
                  success:function(res){
                       console.log(res)
                       if(res.code==0){
                           layer.alert(res.msg,function(){
                               location.href=''
                           })
                       }
                  }
            })

        layer.close(index);
      });
    } 
  });
  
  table.render({
    elem: '#test'
    ,url:'http://127.0.0.1/localhost/linaxi/php/public/index.php/index/admin/show'
    ,cellMinWidth: 80 //全局定义常规单元格的最小宽度，layui 2.2.1 新增
    ,cols: [[
      {field:'goods_id', width:80, title: 'ID', sort: true}
      ,{field:'goods_name', width:80, title: '商品名称', edit: 'text'}
      ,{field:'goods_type', width:80, title: '商品类型', sort: true}
      ,{field:'goods_brand', width:80, title: '商品品牌'}
      ,{field:'goods_price', width:80, title: '商品价格'}
      ,{field:'type_id', width:80, title: '商品分类'}
      ,{field:'img_one', width:80, title: '单文件',toolbar: '#img_one'}
      ,{field:'img_more', width:80, title: '多文件',toolbar: '#img_more'}
      ,{fixed: 'right', width:178, align:'center', toolbar: '#barDemo'}
     
    ]]
    ,id: 'testReload'
    ,page:true
    ,limit:4
    ,limits:[3,4,5]
     ,parseData: function(res){ //res 即为原始返回的数据
        return {
          "code": res.status, //解析接口状态
          "msg": res.msg, //解析提示文本
          "count": res.data.total, //解析数据长度
          "data": res.data.data //解析数据列表
        };
      }
  });
  //监听单元格编辑
  table.on('edit(demo)', function(obj){
    var value = obj.value //得到修改后的值
    ,data = obj.data //得到所在行所有键值
    // ,field = obj.field; //得到字段
          $.ajax({
                  method:'GET',
                  url:'http://127.0.0.1/localhost/linaxi/php/public/index.php/index/admin/updat',
                  data:data,
                  dataType:'JSON',
                  success:function(res){
                       console.log(res)
                       if(res.code==0){
                           layer.alert(res.msg,function(){
                               location.href=''
                           })
                       }
                  }

            })

    layer.msg('[ID: '+ data.id +'] ' + field + ' 字段更改为：'+ value);
  });


});

</script>

</body>
</html>